<%@ page import="com.fearless.crm.settings.entity.DicValue" %>
<%@ page import="java.util.List" %>
<%@ page import="java.util.Map" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + 	request.getServerPort() + request.getContextPath() + "/";

//获取字典类型为stage的字典值列表
	List<DicValue> dicValueList=(List<DicValue>) application.getAttribute("stage");


//获取阶段和可能性之间的对应关系
	Map<String,String> pmap=(Map<String, String>)application.getAttribute("pMap");





%>
<!DOCTYPE html>
<html>
<head>
	<base href="<%=basePath%>">
<meta charset="UTF-8">

<link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>
<script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js"></script>
	<script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/locale/bootstrap-datetimepicker.zh-CN.js"></script>

	<script type="text/javascript" src="jquery/bs_typeahead/bootstrap3-typeahead.min.js"></script>


	<script type="text/javascript">

	//默认情况下取消和保存按钮是隐藏的
	var cancelAndSaveBtnDefault = true;
	
	$(function(){

		$(".timezx").datetimepicker({
			minView: "month",
			language:  'zh-CN',
			format: 'yyyy-mm-dd',
			autoclose: true,
			todayBtn: true,
			pickerPosition: "top-left"
		});


		$("#remark").focus(function(){
			if(cancelAndSaveBtnDefault){
				//设置remarkDiv的高度为130px
				$("#remarkDiv").css("height","130px");
				//显示
				$("#cancelAndSaveBtn").show("2000");
				cancelAndSaveBtnDefault = false;
			}
		});
		
		$("#cancelBtn").click(function(){
			//显示
			$("#cancelAndSaveBtn").hide();
			//设置remarkDiv的高度为130px
			$("#remarkDiv").css("height","90px");
			cancelAndSaveBtnDefault = true;
		});

		$("#remarkBody").on("mouseover",".remarkDiv",function(){
			$(this).children("div").children("div").show();
		})
		$("#remarkBody").on("mouseout",".remarkDiv",function(){
			$(this).children("div").children("div").hide();
		})
		
		$(".remarkDiv").mouseover(function(){
			$(this).children("div").children("div").show();
		});
		
		$(".remarkDiv").mouseout(function(){
			$(this).children("div").children("div").hide();
		});
		
		$(".myHref").mouseover(function(){
			$(this).children("span").css("color","red");
		});
		
		$(".myHref").mouseout(function(){
			$(this).children("span").css("color","#E6E6E6");
		});

		<!--自动补全插件-->
		$("#add-contactCustomerName").typeahead({
			source: function (query, process) {
				$.get(//ajax的另一种写法
						"tran/getCustomerName.do",//url
						{ "name" : query },//data
						function (data) {//回调函数
							//alert(data);
							/*
                                data:
                                    [{客户名称1},{客户名称2},{客户名称3}...]
                            */
							process(data);
						},
						"json"//dataType
				);
			},
			delay: 1500
		});




//给保存按钮绑定事件,执行新增客户备注的操作
        $("#addCustomerRemarkBtn").click(function(){

            $.ajax({

                url:"customer/addCustomerRemark.do",
                type:"post",
                data:{
                    "noteContent":$.trim($("#remark").val()),
                    "customerId":"${requestScope.customer.id}"
                },
                dataType:"json",
                success:function(resp){
          /*
            resp:
                {"success":true/false,"customerRemark":customerRemark}
           */
                    if(resp.success){
                        alert("新增客户备注成功")
/*
						alert(resp.cr.noteContent)
*/
						var html="";
						html+='<div class="remarkDiv" style="height: 60px;">';
						html+='<img title="zhangsan" src="image/user-thumbnail.png" style="width: 30px; height:30px;">';
						html+='<div style="position: relative; top: -40px; left: 40px;" >';
						html+='<h5>'+resp.cr.noteContent+'</h5>';
						html+='<font color="gray">联系人</font> <font color="gray">-</font> <b>666</b> <small style="color: gray;">'+resp.cr.createTime+'由'+resp.cr.createBy+'创建</small>';
						html+='<div style="position: relative; left: 500px; top: -30px; height: 30px; width: 100px; display: none;">';
						html+='<a class="myHref" href="javascript:void(0);"><span class="glyphicon glyphicon-edit" style="font-size: 20px; color: #FF0000;"></span></a>';
						html+='&nbsp;&nbsp;&nbsp;&nbsp;';
						html+='<a class="myHref" href="javascript:void(0);"><span class="glyphicon glyphicon-remove" style="font-size: 20px; color: #FF0000;"></span></a>';
						html+='</div>';
						html+='</div>';
						html+='</div>';

						$("#remarkDiv").before(html)
/*
						alert("执行结束")
*/
                        $("#remark").val("")

                    }else {
                        alert("新增客户备注失败")
                    }

                }




            })

        })

//给更新绑定按钮，执行客户备注的修改操作
		$("#updateRemarkBtn").click(function(){

			var id=$("#remarkId").val()
			$.ajax({
				url:"customer/updateCustomerRemark.do",
				type:"post",
				data:{
					"id":id,
					"noteContent":$.trim($("#noteContent").val())
				},
				dataType:"json",
				success:function(resp){
		/*
			resp:
				{"success":false/true}
		 */
				if(resp.success){
					alert("修改客户备注成功")
					$("#1"+id).html($("#noteContent").val())
					$("#editCustomerRemarkModal").modal("hide")
				}else {
					alert("修改客户备注失败")
				}

				}





			})


		})



//展现客户备注列表
        showCustomerRemark()
//展现联系人列表
		showContactsList()
//展现交易列表
		showTransaction()


//给删除按钮绑定事件,执行联系人的删除操作
		$("#deleteContactBtn").click(function(){
			var contactId=$("#contactId").val()

			$.ajax({
				url:"customer/deleteContact.do",
				type:"post",
				data:{
					"contactId":contactId
				},
				dataType:"json",
				success:function (resp) {
			/*
				resp:
					{"success":false/true}
			 */
					if(resp.success){
						alert("删除联系人成功")
						$("#removeContactsModal").modal("hide")
						showContactsList()
					}else {
						alert("删除联系人失败")
					}



				}


			})

		})


//给新建联系人wq	标签绑定事件,用于铺垫新建联系人的模态窗口
		$("#addContact").click(function(){
			$(".time").datetimepicker({
				minView: "month",
				language:  'zh-CN',
				format: 'yyyy-mm-dd',
				autoclose: true,
				todayBtn: true,
				pickerPosition: "top-left"
			});

			//alert("事件绑定成功")
			$.ajax({
				url:"customer/getUserList.do",
				type:"get",
				data:{

				},
				dataType:"json",
				success:function(resp){
		/*
			resp:
				{"userList":[{user},{user},{user}...]}
		 */

					var html="";
					$.each(resp.userList,function(i,n){
						html+='<option value="'+n.id+'">'+n.name+'</option>'

					})

					$("#add-contactOwner").html(html)
					var currentUser="${sessionScope.user.id}"
					$("#add-contactOwner").val(currentUser)

					$("#createContactsModal").modal("show")

			}

			})

		})

//给保存按钮绑定事件，执行在客户详细页新增联系人的操作
		$("#saveContactBtn").click(function(){

			$.ajax({
				url:"customer/addContact.do",
				type:"post",
				data:{
					"customerName":$.trim($("#add-contactCustomerName").val()),
					"owner":$.trim($("#add-contactOwner").val()),
					"description":$.trim($("#add-contactDescription").val()),
					"contactSummary":$.trim($("#add-contactSummary").val()),
					"source":$.trim($("#add-contactSource").val()),
					"nextContactTime":$.trim($("#add-contactNextContactTime").val()),
					"owner":$.trim($("#add-contactOwner").val()),
					"fullname":$.trim($("#add-contactName").val()),
					"address":$.trim($("#add-contactAddress").val()),
					"appellation":$.trim($("#add-contactAppellation").val()),
					"job":$.trim($("#add-contactJob").val()),
					"mphone":$.trim($("#add-contactMphone").val()),
					"email":$.trim($("#add-contactEmail").val()),
					"birth":$.trim($("#add-contactBirth").val())
				},
				dataType:"json",
				success:function(resp){

			/*
				resp:
					{"success":true/false}
			 */

				if(resp.success){
					alert("新增联系人成功")
					$("#add-contactOwner").val("")
					$("#add-contactSource").val("")
					$("#add-contactName").val("")
					$("#add-contactAppellation").val("")
					$("#add-contactJob").val("")
					$("#add-contactEmail").val("")
					$("#add-contactMphone").val("")
					$("#add-contactBirth").val("")
					$("#add-contactCustomerName").val("")
					$("#add-contactDescription").val("")
					$("#add-contactSummary").val("")
					$("#add-contactNextContactTime").val("")
					$("#add-contactAddress").val("")

					showContactsList()
					$("#createContactsModal").modal("hide")

				}else{
					alert("新增联系人失败")
				}



				}

			})


		})

//给新建交易绑定事件，跳转到新增交易页
		$("#newTran").click(function(){

			var pmap="${applicationScope.pMap}"
			alert(pmap)

		window.location.href="tran/add.do"

				})

//给详细页的编辑按钮绑定事件，执行铺垫修改客户的模态窗口
		$("#editCustomerInDetailBtn").click(function(){

			var currentCustomerOwner="${requestScope.customer.owner}"


			//将客户的id赋值给隐藏域，用于修改成操作
			$("#editCustomer-Id").val("${requestScope.customer.id}")


			//铺垫所有者下拉框
			$.ajax({
				url:"customer/editCustomerInDetail.do",
				type:"get",
				data:{

					"customerId":"${requestScope.customer.id}"

				},
				dataType:"json",
				success:function(resp){
		/*
			resp:
				{"userList":[user,user,user]}
		 */

			var html="<option></option>"
			$.each(resp.userList,function(i,n){
				html+='<option value="'+n.name+'">'+n.name+'</option>';

			})


					$("#editDetail-customerOwner").html(html)
					$("#editDetail-customerOwner").val(currentCustomerOwner)


					//处理单条
					$("#editDetail-customerName").val(resp.customer.name)
					$("#editDetail-website").val(resp.customer.website)
					$("#editDetail-phone").val(resp.customer.phone)
					$("#editDetail-describe").val(resp.customer.description)
					$("#editDetail-contactSummary1").val(resp.customer.contactSummary)
					$("#editDetail-nextContactTime2").val(resp.customer.nextContactTime)
					$("#editDetail-address").val(resp.customer.address)



				}


			})
			$("#editCustomerModal").modal("show")



		})

//在客户详细页给更新按钮绑定事件，执行在客户详细页修改客户的操作
		$("#updateCustomerInDetailBtn").click(function(){
			var id=$("#editCustomer-Id").val()

			$.ajax({
				url:"customer/updateCustomerInDetail.do",
				type:"post",
				data:{
					"id":id,
					"owner":$.trim($("#editDetail-customerOwner").val()),
					"name":$.trim($("#editDetail-customerName").val()),
					"website":$.trim($("#editDetail-website").val()),
					"phone":$.trim($("#editDetail-phone").val()),
					"contactSummary":$.trim($("#editDetail-contactSummary1").val()),
					"nextContactTime":$.trim($("#editDetail-nextContactTime2").val()),
					"description":$.trim($("#editDetail-describe").val()),
					"address":$.trim($("#editDetail-address").val())


				},
				dataType:"json",
				success:function(resp){
		/*
			resp:
				{"success":true/false}

		 */

				if(resp.success){
					alert("修改客户成功")
					$("#editCustomerModal").modal("hide")

					window.location.href="workbench/customer/index.jsp"

				}else{
					alert("修改客户失败")

				}




				}



			})



		})


//给删除000绑定事件，执行在客户详细页删除客户的操作
		$("#deleteCustomerInDetailBtn").click(function(){

			var customerId="${requestScope.customer.id}"

			if(confirm("确定要删除此客户吗？")){
				$.ajax({

					url:"customer/deleteCustomerInDetail.do",
					type:"post",
					data:{
						"customerId":customerId
					},
					dataType:"json",
					success:function(resp){
				/*
					resp:
						{"success":true/false}

				 */

				if(resp.success){
					alert("删除客户成功")
					window.location.href="workbench/customer/index.jsp"
				}else{
					alert("删除客户失败")
				}


					}

				})

			}
		})



	});
//页面加载完毕====================================================================================================

//展现客户相关的备注
	function showCustomerRemark() {
		//alert("展现客户备注方法开始执行")
		var customerId="${requestScope.customer.id}"

		$.ajax({
			url:"customer/showCustomerRemark.do",
			type:"get",
			data:{
				"id":customerId
			},
			dataType:"json",
			success:function(resp){
		/*
			resp:
			{"customerRemark":[{备注},{备注},{备注}]}

		 */

			var html="";

			$.each(resp.customerRemark,function (i,n) {

						html+='<div id="'+n.id+'" class="remarkDiv" style="height: 60px;">';
						html+='<img title="zhangsan" src="image/user-thumbnail.png" style="width: 30px; height:30px;">';
						html+='<div style="position: relative; top: -40px; left: 40px;" >';
						html+='<h5 id="1'+n.id+'">'+n.noteContent+'</h5>';
						html+='<font color="gray">联系人</font> <font color="gray">-</font> <b>'+n.fullname+''+n.appellation+'</b> <small style="color: gray;"> '+n.createTime+' 由'+n.createBy+'创建</small>';
						html+='<div style="position: relative; left: 500px; top: -30px; height: 30px; width: 100px; display: none;">';
						html+='<a class="myHref" href="javascript:void(0);" onclick="editCustomerRemark(\''+n.id+'\')"><span class="glyphicon glyphicon-edit" style="font-size: 20px; color: #FF0000;"></span></a>';
						html+='&nbsp;&nbsp;&nbsp;&nbsp;';
						html+='<a class="myHref" href="javascript:void(0);" onclick="removeCustomerRemark(\''+n.id+'\')"><span class="glyphicon glyphicon-remove" style="font-size: 20px; color: #FF0000;"></span></a>';
						html+='</div>';
						html+='</div>';
						html+='</div>';

			})
				$("#remarkDiv").before(html)

			}


		})
	}

//修改客户备注方法,铺垫修改客户备注的模态窗口
	function editCustomerRemark(id){
		//将客户备注的id放入隐藏域，用于之后的修改
		$("#remarkId").val(id)

		$.ajax({
			url:"customer/editCustomerRemark.do",
			type:"get",
			data:{
				"id":id
			},
			dataType:"json",
			success:function(resp){
		/*
			resp:
				{"customerRemark":{客户备注}}
		*/

			$("#noteContent").val(resp.customerRemark.noteContent)

				$("#editCustomerRemarkModal").modal("show")
			}




		})




	}

//删除客户备注方法
	function removeCustomerRemark(id){
		//alert("方法绑定成功奥"+id)

		if(confirm("确认要删除所选择的客户备注吗")){
			$.ajax({
				url:"customer/deleteCustomerRemark.do",
				type:"post",
				data:{
					"id":id
				},
				dataType:"json",
				success:function(resp){
		/*
			resp:{"success":false/true}

		 */
				if(resp.success){
					alert("删除客户备注成功")
					$("#"+id).remove()
				}else {
					alert("删除客户备注失败")
				}


				}



			})

		}
	}

//展现联系人列表
	function showContactsList() {

		$.ajax({
			url:"customer/showContactList.do",
			type:"get",
			data:{
				"id":"${requestScope.customer.id}"
			},
			dataType:"json",
			success:function(resp){
	/*
		resp:
			{"contactList",[{联系人},{联系人},{联系人}]}
	 */

			var html="";

			$.each(resp.contactList,function (i,n) {

				html+='<tr>';
				html+='<td><a href="contacts/detail.jsp" style="text-decoration: none;">'+n.fullname+'</a></td>';
				html+='<td>'+n.email+'</td>';
				html+='<td>'+n.mphone+'</td>';
				html+='<td><a href="javascript:void(0);" data-toggle="modal" onclick="deleteContact(\''+n.id+'\')" style="text-decoration: none;"><span class="glyphicon glyphicon-remove"></span>删除65</a></td>';
				html+='</tr>';

			})

			$("#contactList").html(html)


			}

		})

	}

//删除联系人方法
	function deleteContact(id) {
		//alert("事件绑定成功"+id)
		//将需要删除的联系人id放置隐藏域
		$("#contactId").val(id)

		$("#removeContactsModal").modal("show")



	}

//展现交易列表方法
 	function showTransaction() {

		$.ajax({

			url:"customer/showTransactionList.do",
			type:"get",
			data:{
				"id":"${requestScope.customer.id}"
			},
			dataType:"json",
			success:function(resp){
		/*
			resp:
				{"transactionList":[{Tran},{Tran}]}
		 */


			var html="";
			$.each(resp.transactionList,function(i,n){

				var stage111=n.stage

				html+='<tr>';
				html+='<td><a href="transaction/detail.jsp" style="text-decoration: none;">'+n.name+'</a></td>';
				html+='<td>'+n.money+'</td>';
				html+='<td>'+n.stage+'</td>';
				html+='<td>'+n.possibility+'</td>';
				html+='<td>'+n.expectedDate+'</td>';
				html+='<td>'+n.type+'</td>';
				html+='<td><a href="javascript:void(0);" data-toggle="modal" data-target="#removeTransactionModal" style="text-decoration: none;"><span class="glyphicon glyphicon-remove"></span>删除</a></td>';
				html+='</tr>';


			})

				$("#tranList").html(html)

			}




		})
	}

</script>

</head>
<body>

	<!-- 删除联系人的模态窗口 -->
	<div class="modal fade" id="removeContactsModal" role="dialog">
		<div class="modal-dialog" role="document" style="width: 30%;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title">删除联系人</h4>
				</div>
				<div class="modal-body">
					<input type="hidden" id="contactId"><!--隐藏域，用于执行联系人删除-->
					<p>您确定要删除该联系人吗？</p>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<button type="button" class="btn btn-danger" id="deleteContactBtn">删除dda</button>
				</div>
			</div>
		</div>
	</div>

    <!-- 删除交易的模态窗口 -->
    <div class="modal fade" id="removeTransactionModal" role="dialog">
        <div class="modal-dialog" role="document" style="width: 30%;">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">×</span>
                    </button>
                    <h4 class="modal-title">删除交易</h4>
                </div>
                <div class="modal-body">
                    <p>您确定要删除该交易吗？</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-danger" data-dismiss="modal">删除</button>
                </div>
            </div>
        </div>
    </div>
	
	<!-- 创建联系人的模态窗口 -->
	<div class="modal fade" id="createContactsModal" role="dialog">
		<div class="modal-dialog" role="document" style="width: 85%;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" onclick="$('#createContactsModal').modal('hide');">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title" id="myModalLabel1">创建联系人</h4>
				</div>
				<div class="modal-body">
					<form class="form-horizontal" role="form">
					
						<div class="form-group">
							<label for="create-contactsOwner" class="col-sm-2 control-label">所有者<span style="font-size: 15px; color: red;">*</span></label>
							<div class="col-sm-10" style="width: 300px;">
								<select class="form-control" id="add-contactOwner">
								 <%-- <option>zhangsan</option>
								  <option>lisi</option>
								  <option>wangwu</option>--%>
								</select>
							</div>
							<label for="create-clueSource" class="col-sm-2 control-label">来源</label>
							<div class="col-sm-10" style="width: 300px;">
								<select class="form-control" id="add-contactSource">
								  <option></option>
									<c:forEach items="${applicationScope.source}" var="source">
										<option value="${source.value}">${source.text}</option>
									</c:forEach>
								  <%--<option>广告</option>
								  <option>推销电话</option>
								  <option>员工介绍</option>
								  <option>外部介绍</option>
								  <option>在线商场</option>
								  <option>合作伙伴</option>
								  <option>公开媒介</option>
								  <option>销售邮件</option>
								  <option>合作伙伴研讨会</option>
								  <option>内部研讨会</option>
								  <option>交易会</option>
								  <option>web下载</option>
								  <option>web调研</option>
								  <option>聊天</option>--%>
								</select>
							</div>
						</div>
						
						<div class="form-group">
							<label for="create-surname" class="col-sm-2 control-label">姓名<span style="font-size: 15px; color: red;">*</span></label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control" id="add-contactName">
							</div>
							<label for="create-call" class="col-sm-2 control-label">称呼</label>
							<div class="col-sm-10" style="width: 300px;">
								<select class="form-control" id="add-contactAppellation">
								  <option></option>
									<c:forEach items="${applicationScope.appellation}" var="appellation">
										<option value="${appellation.value}">${appellation.text}</option>
									</c:forEach>
								  <%--<option>先生</option>
								  <option>夫人</option>
								  <option>女士</option>
								  <option>博士</option>
								  <option>教授</option>--%>
								</select>
							</div>
							
						</div>
						
						<div class="form-group">
							<label for="create-job" class="col-sm-2 control-label">职位</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control" id="add-contactJob">
							</div>
							<label for="create-mphone" class="col-sm-2 control-label">手机</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control" id="add-contactMphone">
							</div>
						</div>
						
						<div class="form-group" style="position: relative;">
							<label for="create-email" class="col-sm-2 control-label">邮箱</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control" id="add-contactEmail">
							</div>
							<label for="create-birth" class="col-sm-2 control-label">生日</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control timezx" id="add-contactBirth" readonly>
							</div>
						</div>
						
						<div class="form-group" style="position: relative;">
							<label for="create-customerName" class="col-sm-2 control-label">客户名称s</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control" id="add-contactCustomerName" placeholder="支持自动补全，输入客户不存在则新建">
							</div>
						</div>
						
						<div class="form-group" style="position: relative;">
							<label for="create-describe" class="col-sm-2 control-label">描述</label>
							<div class="col-sm-10" style="width: 81%;">
								<textarea class="form-control" rows="3" id="add-contactDescription"></textarea>
							</div>
						</div>
						
						<div style="height: 1px; width: 103%; background-color: #D5D5D5; left: -13px; position: relative;"></div>

                        <div style="position: relative;top: 15px;">
                            <div class="form-group">
                                <label for="edit-contactSummary" class="col-sm-2 control-label">联系纪要</label>
                                <div class="col-sm-10" style="width: 81%;">
                                    <textarea class="form-control" rows="3" id="add-contactSummary">这个线索即将被转换</textarea>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="edit-nextContactTime" class="col-sm-2 control-label">下次联系时间</label>
                                <div class="col-sm-10" style="width: 300px;">
                                    <input type="text" class="form-control time" id="add-contactNextContactTime" readonly>
                                </div>
                            </div>
                        </div>

                        <div style="height: 1px; width: 103%; background-color: #D5D5D5; left: -13px; position: relative; top : 10px;"></div>

                        <div style="position: relative;top: 20px;">
                            <div class="form-group">
                                <label for="edit-address1" class="col-sm-2 control-label">详细地址</label>
                                <div class="col-sm-10" style="width: 81%;">
                                    <textarea class="form-control" rows="1" id="add-contactAddress">北京大兴区大族企业湾</textarea>
                                </div>
                            </div>
                        </div>
					</form>
					
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary" id="saveContactBtn">保存</button>
				</div>
			</div>
		</div>
	</div>
	
	<!-- 修改客户的模态窗口 -->
    <div class="modal fade" id="editCustomerModal" role="dialog">
		<input type="hidden" id="editCustomer-Id">
        <div class="modal-dialog" role="document" style="width: 85%;">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">×</span>
                    </button>
                    <h4 class="modal-title" id="myModalLabel">修改客户</h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal" role="form">

                        <div class="form-group">
                            <label for="edit-customerOwner" class="col-sm-2 control-label">所有者<span style="font-size: 15px; color: red;">*</span></label>
                            <div class="col-sm-10" style="width: 300px;">
                                <select class="form-control" id="editDetail-customerOwner">
                                   <%-- <option>zhangsan</option>
                                    <option>lisi</option>
                                    <option>wangwu</option>--%>
                                </select>
                            </div>
                            <label for="edit-customerName" class="col-sm-2 control-label">名称<span style="font-size: 15px; color: red;">*</span></label>
                            <div class="col-sm-10" style="width: 300px;">
                                <input type="text" class="form-control" id="editDetail-customerName" value="动力节点">
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="edit-website" class="col-sm-2 control-label">公司网站</label>
                            <div class="col-sm-10" style="width: 300px;">
                                <input type="text" class="form-control" id="editDetail-website" value="http://www.bjpowernode.com">
                            </div>
                            <label for="edit-phone" class="col-sm-2 control-label">公司座机</label>
                            <div class="col-sm-10" style="width: 300px;">
                                <input type="text" class="form-control" id="editDetail-phone" value="010-84846003">
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="edit-describe" class="col-sm-2 control-label">描述</label>
                            <div class="col-sm-10" style="width: 81%;">
                                <textarea class="form-control" rows="3" id="editDetail-describe"></textarea>
                            </div>
                        </div>

                        <div style="height: 1px; width: 103%; background-color: #D5D5D5; left: -13px; position: relative;"></div>

                        <div style="position: relative;top: 15px;">
                            <div class="form-group">
                                <label for="create-contactSummary1" class="col-sm-2 control-label">联系纪要</label>
                                <div class="col-sm-10" style="width: 81%;">
                                    <textarea class="form-control" rows="3" id="editDetail-contactSummary1"></textarea>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="create-nextContactTime2" class="col-sm-2 control-label">下次联系时间</label>
                                <div class="col-sm-10" style="width: 300px;">
                                    <input type="text" class="form-control timezx" id="editDetail-nextContactTime2" readonly>
                                </div>
                            </div>
                        </div>

                        <div style="height: 1px; width: 103%; background-color: #D5D5D5; left: -13px; position: relative; top : 10px;"></div>

                        <div style="position: relative;top: 20px;">
                            <div class="form-group">
                                <label for="edit-address" class="col-sm-2 control-label">详细地址</label>
                                <div class="col-sm-10" style="width: 81%;">
                                    <textarea class="form-control" rows="1" id="editDetail-address">北京大兴大族企业湾</textarea>
                                </div>
                            </div>
                        </div>
                    </form>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" id="updateCustomerInDetailBtn" class="btn btn-primary" data-dismiss="modal">更新111</button>
                </div>
            </div>
        </div>
    </div>

	<!--修改客户备注的模态窗口-->
	<div class="modal fade" id="editCustomerRemarkModal" role="dialog">
		<%-- 备注的id --%>
		<input type="hidden" id="remarkId">
		<div class="modal-dialog" role="document" style="width: 40%;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title" id="myModalLabel">修改备注</h4>
				</div>
				<div class="modal-body">
					<form class="form-horizontal" role="form">
						<input type="hidden" id="updateRemark-id">
						<div class="form-group">
							<label for="edit-describe" class="col-sm-2 control-label">内容</label>
							<div class="col-sm-10" style="width: 81%;">
								<textarea class="form-control" rows="3" id="noteContent">0.0</textarea>
							</div>
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary" id="updateRemarkBtn">更新65</button>
				</div>
			</div>
		</div>
	</div>

	<!-- 返回按钮 -->
	<div style="position: relative; top: 35px; left: 10px;">
		<a href="javascript:void(0);" onclick="window.history.back();"><span class="glyphicon glyphicon-arrow-left" style="font-size: 20px; color: #DDDDDD"></span></a>
	</div>
	
	<!-- 大标题 -->
	<div style="position: relative; left: 40px; top: -30px;">
		<div class="page-header">
			<h3>${requestScope.customer.name} <small><a href="http://www.bjpowernode.com" target="_blank">${requestScope.customer.website}</a></small></h3>
		</div>
		<div style="position: relative; height: 50px; width: 500px;  top: -72px; left: 700px;">
			<button type="button" id="editCustomerInDetailBtn" class="btn btn-default" data-toggle="modal" ><span class="glyphicon glyphicon-edit" ></span> 编辑000</button>
			<button type="button" id="deleteCustomerInDetailBtn" class="btn btn-danger"><span class="glyphicon glyphicon-minus"></span> 删除000</button>
		</div>
	</div>
	
	<!-- 详细信息 -->
	<div style="position: relative; top: -70px;">
		<div style="position: relative; left: 40px; height: 30px;">
			<div style="width: 300px; color: gray;">所有者</div>
			<div style="width: 300px;position: relative; left: 200px; top: -20px;"><b>${requestScope.customer.owner}	</b></div>
			<div style="width: 300px;position: relative; left: 450px; top: -40px; color: gray;">名称</div>
			<div style="width: 300px;position: relative; left: 650px; top: -60px;"><b>${requestScope.customer.name}</b></div>
			<div style="height: 1px; width: 400px; background: #D5D5D5; position: relative; top: -60px;"></div>
			<div style="height: 1px; width: 400px; background: #D5D5D5; position: relative; top: -60px; left: 450px;"></div>
		</div>
		<div style="position: relative; left: 40px; height: 30px; top: 10px;">
			<div style="width: 300px; color: gray;">公司网站</div>
			<div style="width: 300px;position: relative; left: 200px; top: -20px;"><b>&nbsp;${requestScope.customer.website}</b></div>
			<div style="width: 300px;position: relative; left: 450px; top: -40px; color: gray;">公司座机</div>
				<div style="width: 300px;position: relative; left: 650px; top: -60px;"><b>&nbsp;${requestScope.customer.phone}</b></div>
			<div style="height: 1px; width: 400px; background: #D5D5D5; position: relative; top: -60px;"></div>
			<div style="height: 1px; width: 400px; background: #D5D5D5; position: relative; top: -60px; left: 450px;"></div>
		</div>
		<div style="position: relative; left: 40px; height: 30px; top: 20px;">
			<div style="width: 300px; color: gray;">创建者</div>
			<div style="width: 500px;position: relative; left: 200px; top: -20px;"><b>${requestScope.customer.createBy}&nbsp;&nbsp;</b><small style="font-size: 10px; color: gray;">${requestScope.customer.createTime}</small></div>
			<div style="height: 1px; width: 550px; background: #D5D5D5; position: relative; top: -20px;"></div>
		</div>
		<div style="position: relative; left: 40px; height: 30px; top: 30px;">
			<div style="width: 300px; color: gray;">修改者</div>
			<div style="width: 500px;position: relative; left: 200px; top: -20px;"><b>${requestScope.customer.editBy}&nbsp;&nbsp;</b><small style="font-size: 10px; color: gray;">${requestScope.customer.editTime}</small></div>
			<div style="height: 1px; width: 550px; background: #D5D5D5; position: relative; top: -20px;"></div>
		</div>
        <div style="position: relative; left: 40px; height: 30px; top: 40px;">
            <div style="width: 300px; color: gray;">联系纪要</div>
            <div style="width: 630px;position: relative; left: 200px; top: -20px;">
                <b>
					&nbsp;
					${requestScope.customer.contactSummary}
                </b>
            </div>
            <div style="height: 1px; width: 850px; background: #D5D5D5; position: relative; top: -20px;"></div>
        </div>
        <div style="position: relative; left: 40px; height: 30px; top: 50px;">
            <div style="width: 300px; color: gray;">下次联系时间</div>
            <div style="width: 300px;position: relative; left: 200px; top: -20px;"><b>&nbsp;${requestScope.customer.nextContactTime}</b></div>
            <div style="height: 1px; width: 400px; background: #D5D5D5; position: relative; top: -20px; "></div>
        </div>
		<div style="position: relative; left: 40px; height: 30px; top: 60px;">
			<div style="width: 300px; color: gray;">描述</div>
			<div style="width: 630px;position: relative; left: 200px; top: -20px;">
				<b>
					&nbsp;${requestScope.customer.description}
				</b>
			</div>
			<div style="height: 1px; width: 850px; background: #D5D5D5; position: relative; top: -20px;"></div>
		</div>
        <div style="position: relative; left: 40px; height: 30px; top: 70px;">
            <div style="width: 300px; color: gray;">详细地址</div>
            <div style="width: 630px;position: relative; left: 200px; top: -20px;">
                <b>
					&nbsp;${requestScope.customer.address}
                </b>
            </div>
            <div style="height: 1px; width: 850px; background: #D5D5D5; position: relative; top: -20px;"></div>
        </div>
	</div>
	
	<!-- 备注 -->
	<div id="remarkBody" style="position: relative; top: 10px; left: 40px;" >
		<div class="page-header">
			<h4>备注</h4>
		</div>


		
		<div id="remarkDiv" style="background-color: #E6E6E6; width: 870px; height: 90px;">
			<form role="form" style="position: relative;top: 10px; left: 10px;">
				<textarea id="remark" class="form-control" style="width: 850px; resize : none;" rows="2"  placeholder="添加备注..."></textarea>
				<p id="cancelAndSaveBtn" style="position: relative;left: 737px; top: 10px; display: none;">
					<button id="cancelBtn" type="button" class="btn btn-default">取消</button>
					<button type="button" id="addCustomerRemarkBtn" class="btn btn-primary">保存9</button>
				</p>
			</form>
		</div>
	</div>

	<!-- 交易 -->
	<div>
		<div style="position: relative; top: 20px; left: 40px;">
			<div class="page-header">
				<h4>交易556</h4>
			</div>
			<div style="position: relative;top: 0px;">
				<table id="activityTable2" class="table table-hover" style="width: 900px;">
					<thead>
						<tr style="color: #B3B3B3;">
							<td>名称</td>
							<td>金额</td>
							<td>阶段</td>
							<td>可能性</td>
							<td>预计成交日期</td>
							<td>类型xf</td>
							<td></td>
						</tr>
					</thead>
					<tbody id="tranList">
						<%--<tr>
							<td><a href="transaction/detail.jsp" style="text-decoration: none;">动力节点-交易01</a></td>
							<td>5,000</td>
							<td>谈判/复审</td>
							<td>90</td>
							<td>2017-02-07</td>
							<td>新业务</td>
							<td><a href="javascript:void(0);" data-toggle="modal" data-target="#removeTransactionModal" style="text-decoration: none;"><span class="glyphicon glyphicon-remove"></span>删除</a></td>
						</tr>--%>
					</tbody>
				</table>
			</div>
			
			<div>
				<a href="javascript:void(0)" id="newTran" style="text-decoration: none;"><span class="glyphicon glyphicon-plus"></span>新建交易</a>
			</div>
		</div>
	</div>
	
	<!-- 联系人 -->
	<div >
		<div style="position: relative; top: 20px; left: 40px;">
			<div class="page-header">
				<h4>联系人</h4>
			</div>
			<div style="position: relative;top: 0px;">
				<table id="activityTable" class="table table-hover" style="width: 900px;">
					<thead>
						<tr style="color: #B3B3B3;">
							<td>名称</td>
							<td>邮箱</td>
							<td>手机</td>
							<td></td>
						</tr>
					</thead>
					<tbody id="contactList">
						<%--<tr>
							<td><a href="contacts/detail.jsp" style="text-decoration: none;">李四669</a></td>
							<td>lisi@bjpowernode.com</td>
							<td>13543645364</td>
							<td><a href="javascript:void(0);" data-toggle="modal" data-target="#removeContactsModal" style="text-decoration: none;"><span class="glyphicon glyphicon-remove"></span>删除</a></td>
						</tr>--%>
					</tbody>
				</table>
			</div>
			
			<div>
				<a href="javascript:void(0);" data-toggle="modal" id="addContact" style="text-decoration: none;"><span class="glyphicon glyphicon-plus"></span>新建联系人wq</a>
			</div>
		</div>
	</div>
	
	<div style="height: 200px;"></div>
</body>
</html>